<template>
  <div class="earthui_box" id="earthUI">
    <EarthUI></EarthUI>
  </div>
</template>
<script setup lang="ts">
import { ref, onMounted } from "vue";
import EarthUI from "@/EarthUI.vue";
import apiPage from "@/api/page";
import PageList from "./views/scene/pageList.vue";

const getUrlParams = (url: string) => {
  let urlStr = url.split("?")[1];
  const urlSearchParams = new URLSearchParams(urlStr);
  const result = Object.fromEntries(urlSearchParams.entries());
  return result;
};

onMounted(async () => {
  const params = getUrlParams(window.location.hash || window.location.search);
  if (params && params.name) {
    const res: any = await apiPage.getPageInfo({
      name: params.name,
      namespace: `/insightarts-page`,
      version: "v0",
    });
    if (res.code === 2000010000) {
      const content = res.data.content;
      if (content) {
        setTimeout(() => {
          const scene = JSON.parse(content);
          window.selectedPageInfo = res.data;

          const viewsManager = window.g_xbsjEarthUi.viewsManager;
          window.g_xbsjEarthUi.json = { ...scene };
          window.g_xbsjEarthUi.activeViewer.flyIn(
            scene.lastView.position,
            scene.lastView.rotation,
            3
          );
          // 监听视口状态
          if (viewsManager.cnView.statusChanged) {
            viewsManager.cnView.statusChanged.don((status) => {
              if (status === "Created") {
                window.g_xbsjEarthUi.activeViewer.flyIn(
                  scene.lastView.position,
                  scene.lastView.rotation,
                  3
                );
              }
            });
          }
        }, 3000);
      }
    }
  }
});
</script>

<style lang="scss">
.earthui_box {
  position: absolute;
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #fff;
  width: 100%;
  height: 100%;
}

.cesium-viewer-bottom {
  display: none !important;
}

.es-mask-message {
  z-index: 99999 !important;
}
</style>
